﻿/**
 * How long the fade effect should last (in milliseconds)
 */
var FADE_DURATION = 3000;
/**
 * Interval (in milliseconds) between fades
 */
var FADE_INTERVAL = 6000;
 

/**
 * Global variable used by "fadeImages",
 * to keep track of which image will be faded in
 */
var isMarkerTurn = true;

/**
 * Fade the next image in and the previous image out
 */
function fadeImages(markerIn, markerOut) 
{
  view.setInterval(fadeImages, FADE_INTERVAL);
  
  var outImage;
  var inImage;
  
  // Determine which image is out and which image is in
  if (isMarkerTurn) {
    outImage = markerOut;
    inImage = markerIn;  
  } else {
    outImage = markerIn;
    inImage = markerOut;
  }
  
  // Anonymous closures for the callbacks
  
  view.beginAnimation(function() { setElementOpacity(outImage); }, // callback
                      255, // start value, 255 = full opacity
                      0, // end value, 0 = no opacity or "hidden"
                      FADE_DURATION); // duration in milliseconds

  view.beginAnimation(function() { setElementOpacity(inImage); }, // callback
                      0, // start value 0 = no opacity or "hidden"
                      255, // end value, 255 = full opacity
                      FADE_DURATION); // duration in milliseconds
                      
  // Setup the next turn                    
  isMarkerTurn = !isMarkerTurn;                   
}

/**
 * To be called by "view.beginAnimation".
 * "event.value" holds the interpolated value between
 * "view.beginAnimation"'s start value and end value parameters.
 * @param {view.BasicElement}
 */
function setElementOpacity(element) {
  if (element != null)
  {
    var currentTime = new Date();
    var seconds = currentTime.getSeconds();
    var angle = (360 * seconds) / 60;

    element.opacity = event.value;
    element.rotation = angle;}
}

